#swipper-wrap {
  height: auto;
}

/* SWIPER BANNER  */
.swiper-hero-banner #swipper-ppal {
  position: relative;
  overflow-x: hidden;
  width: 100%;

}

.swiper-pagination-clickable .swiper-pagination-bullet div:nth-of-type(2) svg path:nth-of-type(2) {
  stroke: var(--brand-blue);
}

.swiper-pagination-clickable .swiper-pagination-bullet .pause svg path, .swiper-pagination-clickable .swiper-pagination-bullet .play svg path {
  fill: var(--brand-blue) !important;
  stroke: var(--brand-blue) !important;
}

.swiper-hero-banner .swiper-pagination-bullet.swiper-pagination-bullet {
  border: 1.5px solid var(--gray-dark-5);
}

@media (max-width:1069px) {
  .swiperHome .swiper-hero-banner #swipper-ppal .swiper-backface-hidden .swiper-slide {
      min-height: 378px;
      background: var(--brand-black);
  }
}

.hero-banner__content {
  width: 100%;
  height: auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center right;
  background-attachment: fixed;
  aspect-ratio: 13/5;
}
.hero-banner__content::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
/* background: linear-gradient(90deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 100%); */
background: linear-gradient(40deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
}

.hero-banner__content>picture img,
.hero-banner__content> img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.boxHome{
z-index: 3;
}

/*Solución #1*/

@media (max-width:1069px) {
  .hero-banner__content {
      /* aspect-ratio: 13/6; */
  }
}

@media (max-width:768px) {
  .hero-banner__content {
      height: auto !important;
      background: linear-gradient(to top, black, rgba(0, 0, 0, 0.05) 20%), var(--bg-slide);
      width: 100%;
      /* height: 36rem; Valor que funciona en v1 de box-home Banner*/
      background-repeat: no-repeat;
      background-size: cover;
      background-position: top right;
      min-height: 0rem;
      /* background-attachment: fixed; */
      background-color: var(--black);



  }
}

/***SVG Pagination*/
.swiper-hero-banner svg {
  position: absolute;
  /*ARROW FIRST BUTTON*/
  top: 0rem;
  /*post validation pending (>)*  IMPORTANTE*/
  width: 2.13rem;
  height: 2.13rem;
}



@media (max-width:580px) {
  .swiper-hero-banner>svg {
      position: absolute;
      left: 83%;
      top: 38%;
  }
}

@media (max-width:504px) {
  .swiper-hero-banner>svg {
      position: absolute;
      left: 80%;
      top: 36%;
  }
}

@media (min-width:768px) and (max-width:1366px) {
  .boxHome {
      position: relative;
      color: var(--brand-white);
      height: auto;
      /* bottom: 2.5rem; */
      top: 2rem;
      text-align: left;
      left: 3rem;
      display: flex;
      flex-direction: column;
      justify-content: center;
      width: 30rem;
      padding-bottom: 3rem;
  }
  .hero-banner__content{
      position:absolute !important;
      height:100% !important;
  }
}

@media (min-width:1366px) {
  .boxHome {
      position: relative;
      color: var(--brand-white);
      height: auto;
      /* bottom: 2.5rem; */
      top: 5rem;
      text-align: left;
      left: 5.5rem;
      display: flex;
      flex-direction: column;
      justify-content: center;
      max-width: 43.938rem;
      padding-bottom: 7.5rem;
      padding-top: 6rem;
  }
  .boxHome hr.linea,  .boxHome .mobile-view{
      width: 47rem !important;
  }
  .hero-banner__content{
      position:absolute;
      height:100%;
  }
  #homepage .swiperHome.swiper-hero-banner, .hero-banner__content{
     min-height: 720px;
  }
}

/* @media (max-width:1069px) {
  .boxHome {
      height: 100%;
      bottom: 0rem;        
      width: 55%;
      top: unset;
      justify-content: center;
  }
} */


/*Corrección hero banner and box home*/

@media (max-width:767.98px) {
  .boxHome {
      text-align: left;
      left: 0rem;
      width: 100%;
      top: 0;
      position: relative;
      height: auto;
      /* min-height: 19.5rem; */
      background: var(--black);
      justify-content: end;
      padding: 0 0.95rem 1rem;

  }

  .boxHome::before {
      content: "";
      text-align: center;
      left: 0rem;
      width: 100%;
      height: 3rem;
      top: -3rem;
      position: absolute;
      background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 10%, rgba(0, 0, 0, 0) 100%);

  }
}

/*@media (max-width:320px) {
  .boxHome {
      min-height: 17.5rem;

  }
}*/

.boxHome .title {
    font-family: var(--font-family-1);
    font-size: 57px;
    font-style: normal;
    font-weight: 700;
    line-height: 3.5rem;
    text-transform: capitalize;
    width: max-content;
    color: var(--white);
}

@media (max-width:1069px) {
  .boxHome .title {
      /* font-size: 2.5rem; */
      font-style: normal;
      font-weight: 700;
      line-height: 3.5rem;
      width: 100%;
      max-width: max-content;
      margin: 0;
  }
}


/*Corrección*/
@media (max-width:768px) {
  .boxHome .title {
      font-size: 34px; 
      line-height: 2.591rem;
      /* background: linear-gradient(to top, black 32%, rgba(0, 0, 0, 0) 58%); */
      min-height: auto;
      padding-left: 0;
      max-width: 100vw;
  }
}

.boxHome .paragraph {
    font-family: var(--font-family-2);
    font-size: 18px;
    font-style: normal;
    font-weight: var(--weight-lighter);
    line-height: 1.363rem;
    color: var(--brand-white);
    /* min-height: 3rem; */
    /* max-height: 2.9rem; */
    margin-bottom: 1.5rem;
    text-align: left;
    letter-spacing: 0.02222rem;
}

.Price-for{
  font-family: var(--font-family-2);
  font-size: 0.875rem;
  line-height: 17.6px;
  color: var(--brand-white);
  margin-bottom:0px;
  font-weight:700;
}
.Price-for + p {
  font-family: var(--font-family-2);
  font-size: var(--title-8);
  line-height: 2.25rem;
  color: var(--brand-white);
  font-weight: 700;
}

@media (max-width: 1069px) {
  .boxHome .paragraph {
      font-size: 1.1rem;
      font-style: normal;
      font-weight: 300;
      /* min-height: 3rem; */
      /* max-height: 2.9rem; */
      margin-bottom: 1rem;
      text-align: left;
      /* padding-right: 2rem; */
  }
}


@media (max-width: 768px) {
  .boxHome .paragraph {
      /* min-height: 4.3rem; */
      /* max-height: 4.5rem; */
      /* display: flex;
      align-items: end; */
      /* margin-left: 0.9rem; */
      /* margin-bottom: 3rem; */
      font-size: 18px;
  }
    .btn_large.btn_primary {
        border: 1px solid var(--brand-white);
        font-size: 1.125rem;
    }

    .buttonsBanner a p.btn_secondary_normal1 {
        font-size: 1.125rem;
    }
}

/* @media (max-width: 404px) {
  .boxHome .paragraph {
      min-height: 5rem;
      max-height: 5.1rem;

  }
} */

@media (max-width: 320px) {
    .boxHome .paragraph {
/*        min-height: 4.3rem;
        max-height: 4.5rem;*/
        /* min-height: 2.5rem;
      max-height: 2.6rem; */
        font-size: 18px;
        line-height: 1.22222rem;
/*        margin-left: 0.9rem;*/
        padding-right: 1rem;
        /* margin-bottom: 1rem; */
    }

}




/* LINEA SEPARADORA */
.linea {
  width: 100%;
  position: relative;
  border-width: 1px;
  border-style: solid;
  border-image: linear-gradient(to right, white, rgba(137,137,137,0.05)) 1;
  opacity: 1 !important;
}

@media (max-width:768px) {
  .linea {
      width: 100%;
      /* left: 5%; */
      /* height: 0.11rem; */
      border-radius: 10px;
      background: linear-gradient(90deg, #FFF 0%, rgba(255, 255, 255, 0.00) 100%);
      position: relative;
      /* margin-top: 2rem; */
      border-width: 1px !important;
  }
}


/*Paragraph*/
.boxHome>h2,
.boxHome>p {

  font-size: 1.25rem;
  text-transform: uppercase;
  text-align: left;
}

@media (max-width:768px) {

  .boxHome>h2,
  .boxHome>p {
      /* padding: 0.5rem 2rem; */
      margin-bottom: 0;
      font-size: 1.25rem;
      text-transform: uppercase;
      text-align: left;
      min-height: 3rem;
      /* max-height: 2.9rem; */
  }
}



/**BOTONESS*/

.buttonsBanner>a {
  font-family: var(--font-family-1);
  font-size: 1rem;
  font-style: normal;
  text-decoration: none;
  font-weight: 600;
  line-height: 1.33333rem;
  width: 100%;
}

.buttonsBanner a p.btn_secondary_normal1 {
    color: var(--brand-white) !important;
    border: 2px solid var(--brand-white) !important;
}
.buttonsBanner a p.btn_secondary_normal1:hover {
  border: 2px solid var(--gray-dark-4) !important;
}

@media (max-width:768px) {
  .buttonsBanner {
      display: flex;
      /* padding: 10px 20px; */
      flex-direction: row-reverse;
  }
}

@media (max-width:768px) {
  .buttonsBanner>a {
      flex: 0 0 auto;
      width: 50%;
  }
}

@media (min-width:769px) and (max-width:1428px) {
  .buttonsBanner>a {
      display: block;
      width: 365px;
  }
}

/*Contenedor botones*/
.link-wrapper {
  border: 1px solid var(--darkGray);
  padding: .7rem 0;
  margin-top: 2.5rem;
  /* width: 75%; */
}

@media (max-width:1280px) {
  .link-wrapper {
      padding: 0.5rem 0;
      margin-top: 1rem;
  }
}

@media (max-width:768px) {
  .link-wrapper {
      margin: 0;
      /* width: 100%; */
      text-align: center;
  }
}

/*Buttons Funcionality Black And white*/
.buttonsBanner {
  /*width: 25%; First Version*/
  width: 100%;
  /* padding-top: 1rem; */
  text-align: center;
}

.buttonsBanner>a {
  text-decoration: none;
  display: contents;
}

@media (max-width:768px) {

  .buttonsBanner {
      width: 100%;
      display: flex;
      flex-direction: initial;
  }
}
@media (max-width:780px) {
  .buttonsBanner {
      justify-content: center;
      flex-direction: row ;
      gap: 10px;
  }
}

@media (max-width:768px) {

  .buttonsBanner>a {
      flex: 1 1 auto;
  }
}

@media (min-width:768px) and (max-width:1428px) {

  .buttonsBanner>a {
      
      width: 252px;
  }
}

.link-wrapper {
  /* border: 1px solid var(--darkGray);
  padding: 1rem 0;
  margin-top: var(--title-2);
  width: 25rem; */
}

@media (max-width:1280px) {

  .link-wrapper {
      /* padding: 0.5rem 0;
      margin-top: var(--title-5); */
  }
}

@media (max-width:768px) {

  .link-wrapper {
      /* margin: var(--title-5) 0 0.15rem 0; */
  }
}

.black-button {
  color: var(--white);
  background-color: var(--brand);
  margin: 0 0 1rem 0;
  border: 0.12rem solid var(--brand);
  font-family: var(--font-family-1);
  font-size: 1.125rem;
  font-style: normal;
  font-weight: var(--weight-bold);
  /* text-transform: uppercase; */
}


.black-button:hover {
  color: var(--white);
  background-color: var(--brand-dark);
  border-color: var(--brand-dark);
  transition: all 0.5s;

}

.black-button:active {
  color: var(--brand-white);
  background-color: var(--brand-dark-dark);
  border: none;
}

@media (max-width:900px) {
  .hero-banner__content {
      height: 460px;
  }
}



@media (max-width:768px) {
  .white-button,
  .black-button {
      padding: 0.8rem 2rem;
      margin: 0;
  }

  .black-button {

      display: flex;
      justify-content: center;
      align-items: center;
  }
}


.white-button {
  color: var(--gray-light-1);
  background-color: transparent;
  margin: 0 0 .1rem 0;
  border: 0.12rem solid var(--brand-white);
  font-family: var(--font-family-1);
  font-size: 1.125rem;
  font-style: normal;
  font-weight: var(--weight-bolder);
  line-height: normal;
  /* text-transform: uppercase; */
}

.white-button:hover {
  color: var(--brand-white);
  background-color: var(--white-20);

}



/* Base Legal */
.legalBases>a {

  text-decoration: none;

}

.legalBases>a>p {
  font-family: var(--font-family-1);
  color: var(--white);
  font-size: 12px;
  font-weight: 400;
  line-height: 1rem;
  letter-spacing: 0em;
  text-align: left;
  margin-top: 1.5rem;

}

@media (max-width:1366px) {
  .legalBases > a > p {
      font-family: var(--font-family-1);
      color: var(--white);
      font-size: var(--paragraph-3);
      font-weight: var(--weight-normal);
      line-height: 1rem;
      letter-spacing: 0em;
      text-align: left;
      margin-top: .5rem;

  }
  
  .swiper-pagination-clickable .swiper-pagination-bullet .pause svg path, .swiper-pagination-clickable .swiper-pagination-bullet .play svg path {
      fill: var(--brand-blue) !important;
      stroke: var(--brand-blue) !important;
  }

  .swiper-hero-banner .swiper-pagination-bullet.swiper-pagination-bullet {
      border: 1.5px solid var(--brand-blue);
  }
}

/* .swiper-pagination-bullets {
  height: 34px;
  width: auto !important;
} */

.swiper-pagination-hero-banner.timer-banner {
  position: relative;
  width: 100%;
  padding-left: 5.5rem;
  z-index: 1;
  /* top: 500px !important; */
}


@media (max-width:1366px) {

  .swiper-pagination-hero-banner.timer-banner {
      padding-left: 0rem;
      
  }

  .swiper-pagination-hero-banner {
      position: relative;
      display: flex;
      justify-content: center;
      margin-left: 0;
      margin-top: 2rem;
  }
}

@media (min-width:1367px) {

  .swiper-pagination-hero-banner.timer-banner {
      position: absolute;
      
  }
  .buttonsBanner {
      width: 58%;
  }
  .legalBases{
      padding-top: 1.5rem;
  }
}

.boxHome .mobile-view .legalBases{
  font-family:var(--font-family-2) !important;
}


/* Section 1.2 Banner / Update Color´s and structure pagination */
.swiper-hero-banner .swiper-pagination-bullet {
  width: 1rem;
  height: 1rem;
  border: 1.5px solid var(--gray);
  position: relative;
  opacity: 1;
  background: transparent;
  top: -.2rem;
}

/*Icon Pause */
.swiper-pagination-clickable .swiper-pagination-bullet .pause svg,
.swiper-pagination-clickable .swiper-pagination-bullet .play svg {
  width: .8rem;
  height: .8rem;
  margin-left: .26rem;
  top: .24rem;    
}

@media (max-width:1920px) {

  .swiper-pagination-clickable .swiper-pagination-bullet .pause svg,
  .swiper-pagination-clickable .swiper-pagination-bullet .play svg {
      width: 1.2rem;
      height: 1.2rem;
      /* margin-left: .30rem;
      top: .28rem; */
      margin-left: .50rem;
      top: .45rem;
  }
}

@media (max-width:1700px) {

  .swiper-pagination-clickable .swiper-pagination-bullet .pause svg,
  .swiper-pagination-clickable .swiper-pagination-bullet .play svg {
      /* width: 1rem;
      height: 1rem;
      margin-left: .33rem;
      top: .28rem; */
  }
}

/* @media (max-width:797px) {

  .swiper-pagination-clickable .swiper-pagination-bullet .pause svg,
  .swiper-pagination-clickable .swiper-pagination-bullet .play svg {
      width: 1rem;
      height: 1rem;
      margin-left: .33rem;
      top: .28rem;
  }
} */


@media (max-width:695px) {

  .swiper-pagination-clickable .swiper-pagination-bullet .pause svg,
  .swiper-pagination-clickable .swiper-pagination-bullet .play svg {
      /* width: 1rem;
      height: 1rem; */
      /*margin-left: -1.0rem;*/
      /* top: .28rem; */
  }
}




/* @media (max-width:797px) {

  .swiper-content-pagination .swiper-horizontal>.swiper-pagination-bullets,
  .swiper-pagination-bullets.swiper-pagination-horizontal.timer-banner {
      left: 4rem;
      position: relative;
      bottom: 2.8rem;

  }
} */

@media (max-width:768px) {
  .swiper-content-pagination .swiper-horizontal>.swiper-pagination-bullets,
  .swiper-pagination-bullets.swiper-pagination-horizontal.timer-banner {
      left: 0rem;
      position: relative;
      bottom: 0.3rem;
      padding-top: 2rem; 
      margin: 0;
      width: 100%;
  }

  .swiper-hero-banner .swiper-pagination-bullet.swiper-pagination-bullet {
      border: 1.5px solid var(--brand-blue);
  }
}


@media (max-width:1920px) {
  .swiper-hero-banner .swiper-pagination-bullet {
    width: 16px;
    height: 16px;
      border: 1.5px solid var(--gray-light-1);
      background-color: transparent;
      margin-right: 0.7rem !important;
  }
}

@media (max-width:1700px) {
  .swiper-hero-banner .swiper-pagination-bullet {
      /* width: 17px;
      height: 17px; */
      border: 1.5px solid var(--brand-white);
      background-color: none;
      /* top: 0.2rem; */
  }
}
@media (max-width:1400px) {
  .swiper-hero-banner .swiper-pagination-bullet {
      /* width: 17px;
      height: 17px; */
      border: 1.5px solid var(--brand-white);
      background-color: none;
      top: -1.8rem;
  }
}
@media (max-width:1366px) {
  .swiper-hero-banner .swiper-pagination-bullet {
     
      top: -0.5rem;
  }
  .swiper-pagination-hero-banner.timer-banner {
      top: calc(94.1% - 2.5vh) !important;
      padding-left:0;
  }
}
@media (max-width:1366px) {
  .swiper-hero-banner .swiper-pagination-bullet {
      /* width: 15px;
      height: 15px; */
      border: 1.5px solid var(--brand-white);
      background-color: none;
      top: 0rem;
  }
}

@media (max-width:1080px) {
  .swiper-hero-banner .swiper-pagination-bullet {
      /* width: 15px;
      height: 15px; */
      border: 1.5px solid var(--brand-white);
      background-color: none;
  }
}





@media (max-width:320px) {
  .swiper-hero-banner .swiper-pagination-bullet {
      width: 12px;
      height: 12px;
      margin-left: 0;
      margin-top: 2.5rem;
      background-color: none;
  }
}

.swiper-hero-banner .swiper-pagination-bullet.swiper-pagination-bullet-active {
  border: transparent !important;
  width: 2rem;
  height: 2rem;
  top: 0.23rem;
}

@media (max-width:1920px) {
  .swiper-hero-banner .swiper-pagination-bullet.swiper-pagination-bullet-active {
      
      /* width: 1.7rem;
      height: 1.7rem; */
      /* top: 0.2rem; */
  }
}

@media (max-width:1700px) {
  .swiper-hero-banner .swiper-pagination-bullet.swiper-pagination-bullet-active {
      
      /* width: 1.7rem;
      height: 1.7rem; 
      top: 0.36rem;*/
  }
}

@media (max-width:1400px) {
  .swiper-hero-banner .swiper-pagination-bullet.swiper-pagination-bullet-active {
      
      /* width: 1.7rem;
      height: 1.7rem;*/ 
      top: -1.5rem;
  }
  .swiper-pagination-hero-banner.timer-banner {
      top: 98% !important;
  }
}

@media (max-width:1366px) {
  .swiper-hero-banner .swiper-pagination-bullet.swiper-pagination-bullet-active {
      
      /* width: 1.7rem;
      height: 1.7rem;  */
      top: -0.5rem;
  }
}


@media (max-width:768px) {

  .swiper-hero-banner .swiper-pagination-bullet.swiper-pagination-bullet{
      top: -0.5rem; 

  }
}